<template>
	<view class="home">
		<view class="homebgBox">
			<view class="navBar">
				首页
			</view>
			<view class="bannerBox">

				<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay"
					style="width: 690rpx; height: 400rpx;">
					<swiper-item v-for="(item,index) in bannnerList" :key="index" style="text-align: center;">
						<image class="contentImg" :src="item.img_url"
							style="width: 690rpx;height:400rpx; border-radius: 20rpx;" @click="handleBnner(item)">
						</image>
					</swiper-item>
				</swiper>

				<!-- <image src="../../static/image/homebanner.png" mode="" style="width: 690rpx;height:300rpx;"></image> -->
			</view>
		</view>
		<view class="" style="height: 204rpx;"></view>

		<!-- 		<view class="informationBox">
			<view class="titleBox">
				<view class="line"></view>
				<view class="title">
					资讯动态
				</view>
			</view>

			<view class="informationlist" v-for="(item,index) in activityList" @click="handleInformation(item)">
				<view class="time">
					发布时间:{{item.created_at}}
				</view>
				<view class="content">
					{{item.title}}
				</view>
				<view class="heng"></view>

				<view class="look">
					查看
				</view>
			</view>

		</view> -->

		<view v-if="identity == 1 || identity == 2" class="studentBox" style="margin-top: 60rpx;">
			<view class="titleBox">
				<view class="line"></view>
				<view v-if="identity == 1" class="title">
					孩子列表
				</view>
				<view v-if="identity == 2" class="title">
					学生列表
				</view>
			</view>

			<view v-if="studentList.length>0" class="studentList">
				<scroll-view class="scroll-view_H" scroll-x="true" @scrolltolower="handleScrolltolower">
					<view id="demo1" class="scroll-view-item_H" v-for="(item,index) in studentList"
						:class="currIndex1==index ? 'selected' :''" @click="handleStudentItem(item,index)">{{item.name}}
					</view>
				</scroll-view>
			</view>

			<view class="studentList" v-if="studentList.length==0">
				<view class="" style="width: 170rpx;text-align: center;margin: 0 auto;">
					<image src="../../static/image/nullimg.png" style="width: 148rpx;height: 148rpx;" mode=""></image>
					<view class=""
						style="font-size: 28rpx;font-family: PingFang SC, PingFang SC;font-weight: 400;color: #AEB8C2;line-height: 28rpx;">
						{{identity == 1 ? "暂无孩子" : "暂无学生"}}
					</view>
				</view>
			</view>



		</view>

		<view class=" jobBox" style="margin-top: 20rx;">
			<view class="titleBox">
				<view class="line"></view>
				<view class="title">
					待办任务
				</view>
			</view>

			<view v-if="taskLists.length" class="jobList">
				<view class="jobitem" v-for="(item,index) in taskLists" @click="handleTaskdetail(item)">
					<image v-if="item.image" :src="item.image" mode=""
						style="width: 160rpx;height: 160rpx;border-radius: 8rpx;">
					</image>
					<view class="leftBox">
						<view class="content">
							{{item.title}}
						</view>
						<view class="time">
							截止时间:{{item.end_time}}
						</view>
					</view>
				</view>
			</view>
			<view v-else class="jobList">
				<view class="" style="width: 170rpx;text-align: center;margin: 0 auto;">
					<image src="../../static/image/nullimg.png" style="width: 148rpx;height: 148rpx;" mode=""></image>
					<view class=""
						style="font-size: 28rpx;font-family: PingFang SC, PingFang SC;font-weight: 400;color: #AEB8C2;line-height: 28rpx;">
						暂无待办任务
					</view>
				</view>
			</view>

		</view>

		<view class="examination">
			<view class="titleBox">
				<view class="line"></view>
				<view class="title">
					近期会议
				</view>
			</view>

			<view v-if="meetingList.length" class="examinationList">
				<view class="examinationItem" v-for="(item,index) in meetingList" @click="handleMeeting(item)">
					<image v-if="item.image" :src="item.image" mode=""
						style="width: 160rpx;height: 160rpx;border-radius: 10rpx;"></image>
					<view class="bottomBox">
						{{item.title}}
						<view class="time">
							会议时间:{{item.strart_time}}
						</view>
					</view>
				</view>
			</view>

			<view v-else class=""
				style="padding: 30rpx 20rpx;background-color: #ffffff;margin-top: 20rpx;border-radius: 16rpx 16rpx 16rpx 16rpx;">
				<view class="" style="width: 170rpx;text-align: center;margin: 0 auto;">
					<image src="../../static/image/nullimg.png" style="width: 148rpx;height: 148rpx;" mode=""></image>
					<view class=""
						style="font-size: 28rpx;font-family: PingFang SC, PingFang SC;font-weight: 400;color: #AEB8C2;line-height: 28rpx;">
						暂无考试
					</view>
				</view>
			</view>

		</view>

		<view class="examination">
			<view class="titleBox">
				<view class="line"></view>
				<view class="title">
					考试安排
				</view>
			</view>

			<view v-if="InformationList.length" class="examinationList">
				<view class="examinationItem" v-for="(item,index) in InformationList" @click="handleKs(item)">
					<image v-if="item.image" :src="item.image" mode=""
						style="width: 160rpx;height: 160rpx;border-radius: 10rpx;"></image>
					<view class="bottomBox">
						{{item.title}}
						<view class="time">
							考试时间:{{item.strart_time}}
						</view>
					</view>
				</view>
			</view>

			<view v-else class=""
				style="padding: 30rpx 20rpx;background-color: #ffffff;margin-top: 20rpx;border-radius: 16rpx 16rpx 16rpx 16rpx;">
				<view class="" style="width: 170rpx;text-align: center;margin: 0 auto;">
					<image src="../../static/image/nullimg.png" style="width: 148rpx;height: 148rpx;" mode=""></image>
					<view class=""
						style="font-size: 28rpx;font-family: PingFang SC, PingFang SC;font-weight: 400;color: #AEB8C2;line-height: 28rpx;">
						暂无考试
					</view>
				</view>
			</view>

		</view>


		<view class="" style="height: 120rpx;"></view>
	</view>
</template>

<script>
	import {
		banner,
		taskList,
		meetingList,
		activityIndex,
		examination,
		userinfo,
		studentList,
		getOpenid
	} from "@/api/api.js"
	export default {
		data() {
			return {
				bgColor: "transparent",
				bannnerList: [],
				indicatorDots: true,
				autoplay: true,
				interval: 2000,
				duration: 500,
				taskLists: [],
				meetingList: [],
				activityList: [],
				InformationList: [],
				userId: "",
				studentList: [],
				currIndex1: 0,
				identity: null,
				logincode: "",
				pageNum: 1,
			}
		},
		async onLoad() {
			if (uni.getStorageSync('token')) {
				await this.handleuserinfo()
				await this.handleGetbanner()
				await this.handleGetactivityIndex()
				await this.handletaskList()
				await this.hadlemeetingList()
				await this.handleGetexamination()
			} else {
				await this.handleGetbanner()
				await this.handleGetactivityIndex()
			}
		},

		async onPullDownRefresh() {
			// console.log("触发了下拉刷新"),
			if (uni.getStorageSync('token')) {
				await this.handleuserinfo()
				await this.handleGetbanner()
				await this.handleGetactivityIndex()
				await this.handletaskList()
				await this.hadlemeetingList()
				await this.handleGetexamination()
			} else {
				await this.handleGetbanner()
				await this.handleGetactivityIndex()
			}
			// await this.handleuserinfo()
			// await this.handleGetbanner()
			// await this.handleGetactivityIndex()
			// await this.handletaskList()
			// await this.hadlemeetingList()
			// await this.handleGetexamination()
			uni.stopPullDownRefresh();
		},
		methods: {
			async handleuserinfo() {
				let res = await userinfo()
				this.identity = res.data.identity
				if (res.data.identity == 1 || res.data.identity == 2) {
					this.handlestudentList()
					this.userId = res.data.id
				} else {
					this.userId = res.data.id
				}
				let that = this
				if (res.data.xcx_openid == null) {
					uni.login({
						provider: 'weixin',
						success: async (loginRes) => {
							console.log("微信获取code码", loginRes.code);
							that.logincode = loginRes.code
							let res = await getOpenid({
								code: that.logincode
							})
						}
					})
				}
			},

			handleStudentItem(item, index) {

				this.currIndex1 = index
				this.userId = item.id
				this.handletaskList()
				this.hadlemeetingList()
				this.handleGetexamination()
			},

			async handlestudentList() {
				let res = await studentList({
					page: this.pageNum,
					page_size: 10,
				})
				// console.log("学生列表", res)
				if (res.data.data.length > 0) {

					// this.studentList.push(item) = res.data.data
					res.data.data.forEach((item, index) => {
						this.studentList.push(item)
					})
					if (this.pageNum == 1) {
						this.studentList.unshift({
							name: "我的",
							id: this.userId
						})
						this.userId = this.studentList[0].id
					}
				} else {
					uni.showToast({
						title: '暂无更多数据',
						icon: "none",
						duration: 2000
					});
				}


			},
			handleScrolltolower() {
				console.log("handleScrolltolower")
				this.pageNum = this.pageNum + 1
				this.handlestudentList()
			},
			async handleGetbanner() {
				let res = await banner()
				// console.log("banner", res)
				this.bannnerList = res.data
			},
			async handleGetactivityIndex() {
				this.activityList = []
				let res = await activityIndex()
				// console.log("资讯", res)
				if (res.data.data.length > 0) {
					this.activityList = res.data.data.slice(0, 1)
				}
			},
			async handletaskList() {
				this.taskLists = []
				let res = await taskList({
					id: this.userId
				})
				// console.log("任务列表", res)
				this.taskLists = res.data.data
			},
			async hadlemeetingList() {
				this.meetingList = []
				let res = await meetingList({
					page: 1,
					page_size: 10,
					type: 1,
					id: this.userId
				})
				if (res.data.data.length > 0) {
					this.meetingList = res.data.data.slice(0, 1)
					// console.log("会议列表", this.meetingList)
				}
			},
			async handleGetexamination() {
				this.InformationList = []
				let res = await examination({
					page: 1,
					page_size: 10,
					id: this.userId
				})
				this.InformationList = res.data.data
				// console.log("考试列表", res)
			},
			handleBnner(item) {
				console.log("item", item)
				// console.log("公司介绍", )
				let data = {
					name: item.name,
					content: item.content
				}
				uni.setStorageSync("companyData", data)
				uni.navigateTo({
					url: `./companyIntroduction`
				})
			},
			handleInformation(item) {
				uni.navigateTo({
					url: `/pages/information/detail?id=${item.id}`
				})
			},
			handleTaskdetail(item) {
				uni.navigateTo({
					url: `./taskDetail?id=${item.id}`
				})
			},
			handleMeeting(item) {
				uni.navigateTo({
					url: `/pages/home/meetingDetails?id=${item.id}`
				})
			},
			handleKs(item) {
				uni.navigateTo({
					url: `/pages/home/examinationDetail?id=${item.id}`
				})
			}
		}
	}
</script>

<style scoped lang="scss">
	// .page{
	// 	width: 100%;
	// 	min-height: 100%;
	// 	background-color: pink;
	// }
	.home {
		.homebgBox {
			width: 100%;
			height: 342rpx;
			// position: absolute;
			// top: 0;
			background-image: url("http://ring-42291.oss-cn-beijing.aliyuncs.com/upload/imgs/user/202312/13/84BHalgxBiVbeqaoTMOrNDa84ZUdI46YSxv9HvTI.png");
			z-index: 0;
			padding-top: 110rpx;
			box-sizing: border-box;

			.navBar {
				width: 100%;
				text-align: center;
				margin-bottom: 28rpx;
				font-size: 31rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: bold;
				color: #000000;
				line-height: 37rpx;
			}

			.bannerBox {
				z-index: 999;
				width: 690rpx;
				margin: 0 auto;
				margin-top: 20rpx;
			}
		}

		.titleBox {
			display: flex;
			align-items: center;

			.line {
				width: 8rpx;
				height: 36rpx;
				background: #1C68C5;
				border-radius: 188rpx 188rpx 188rpx 188rpx;
			}

			.title {
				font-size: 36rpx;
				font-family: PingFang SC, PingFang SC;
				font-weight: 600;
				color: #073062;
				line-height: 36rpx;
				margin-left: 20rpx;
			}

		}

		.informationBox {
			margin-top: 40rpx;
			padding: 0 30rpx;
			box-sizing: border-box;

			.informationlist {
				width: 690rpx;
				height: 236rpx;
				background: #FFFFFF;
				border-radius: 16rpx 16rpx 16rpx 16rpx;
				margin-top: 20rpx;
				padding: 30rpx 20rpx;
				box-sizing: border-box;

				.time {
					font-size: 28rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #999999;
					line-height: 28rpx;
				}

				.content {
					font-size: 30rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 600;
					color: #073062;
					line-height: 30rpx;
					margin-top: 30rpx;
				}

				.heng {
					width: 650rpx;
					height: 2rpx;
					background-color: #EEEEEE;
					margin-top: 20rpx;
				}

				.look {
					width: 112rpx;
					height: 48rpx;
					border-radius: 32rpx 32rpx 32rpx 32rpx;
					opacity: 1;
					border: 2rpx solid #255A9B;
					font-size: 28rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #255A9B;
					line-height: 48rpx;
					text-align: center;
					margin-top: 20rpx;
					margin-left: 520rpx;
				}
			}
		}

		.studentBox {
			margin-top: 40rpx;
			padding: 0 30rpx;
			box-sizing: border-box;

			.studentList {
				width: 100%;
				padding: 20rpx;
				background-color: #ffffff;
				box-sizing: border-box;
				margin-top: 20rpx;

				.scroll-Y {
					height: 52rpx;
				}

				.scroll-view_H {
					white-space: nowrap;
					width: 100%;
					// background-color: pink;
				}

				.scroll-view-item {
					height: 52rpx;
					line-height: 52rpx;
					text-align: center;
				}

				.scroll-view-item_H {
					display: inline-block;
					line-height: 52rpx;
					text-align: center;
					font-size: 32rpx;
					font-family: PingFang SC, PingFang SC;
					font-weight: 400;
					color: #999999;
					height: 52rpx;
					border: 1rpx solid #CCCCCC;
					border-radius: 8rpx 8rpx 8rpx 8rpx;
					margin-right: 20rpx;
					text-align: center;
					padding: 0 40rpx;
				}

				.selected {
					border: 1rpx solid #255A9B;
					// background: #FFF3F5;
					color: #255A9B;
				}
			}
		}

		.jobBox {
			margin-top: 60rpx;
			padding: 0 30rpx;
			box-sizing: border-box;

			.jobList {
				padding: 30rpx 20rpx;
				background-color: #ffffff;
				margin-top: 20rpx;
				border-radius: 16rpx 16rpx 16rpx 16rpx;

				.jobitem {
					width: 100%;
					display: flex;
					margin-bottom: 30rpx;

					.leftBox {
						width: 460rpx;
						height: 160rpx;
						margin-left: 10rpx;
						display: flex;
						flex-direction: column;
						justify-content: space-between;

						.content {
							font-size: 30rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: 600;
							color: #073062;
							line-height: 44rpx;
							width: 460rpx;
						}

						.time {
							font-size: 28rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: 400;
							color: #999999;
							line-height: 28rpx;
							margin-top: 32rpx;
						}
					}
				}
			}
		}

		.examination {
			margin-top: 40rpx;
			padding: 0 30rpx;
			box-sizing: border-box;

			.examinationList {
				// display: flex;
				// flex-wrap: wrap;
				margin-top: 20rpx;

				.examinationItem {
					width: 690rpx;
					height: 220rpx;
					background: #FFFFFF;
					border-radius: 16rpx 16rpx 16rpx 16rpx;
					margin-right: 20rpx;
					margin-bottom: 20rpx;
					display: flex;
					align-items: center;
					padding: 30rpx;
					box-sizing: border-box;

					.bottomBox {
						height: 120rpx;
						padding: 0 20rpx;
						box-sizing: border-box;
						display: flex;
						flex-direction: column;
						justify-content: space-between;
						font-size: 30rpx;
						font-family: PingFang SC, PingFang SC;
						font-weight: 600;
						color: #073062;
						line-height: 30rpx;

						.type {
							font-size: 30rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: 600;
							color: #073062;
							line-height: 30rpx;
						}

						.time {
							font-size: 30rpx;
							font-family: PingFang SC, PingFang SC;
							font-weight: 400;
							color: #999999;
							line-height: 20rpx;
							margin-top: 20rpx;
						}
					}
				}

				// .examinationItem:nth-child(2n) {
				// 	margin-right: 0;
				// }
			}
		}
	}
</style>